<template>
	<view class="container">
		<image src="../../static/imgaes/登录-图片.png" style="width: 100%;height: 57vh;"></image>
		<button type="default" @click="loge" v-if="loges">登录</button>
		<view class="Popup" v-if="Popup">
			<view style="" class="text">
				您好，小程序需要您的授权才能更好的为您服务哦1-
				<view class="" style="font-size: 12px;">
					获取你的公开信息(昵称，头像，手机号等)
				</view>
			</view>
			<view class="" style="display: flex;">
				<button class="cancel" @click="cancel">取消</button>
				<button class="determine" @click="determine">登录</button>
			</view>
		</view>
         <!-- 登录 -->
	</view>
</template>

<script>
	export default {
		data() {
			return {
		Popup: true,
				loges: false
			}
		},
		onLoad() {
			// const value = uni.getStorageSync('userInfo');
			// if (value) {
			// 	uni.switchTab({
			// 		url: '/pages/home/home'
			// 	});
			// }
		},
		methods: {
			// 取消
			cancel() {
				this.loges = true;
				this.Popup = false;
			},
			// 登录 验证授权
			determine() {
				this.Popup = false
				uni.getUserProfile({
					desc: '用于完善会员资料', // 声明获取用户个人信息后的用途，后续会展示在弹窗中，请谨慎填写
					success: (res) => {
						console.log(res.userInfo, '000')
						uni.setStorageSync('userInfo', res.userInfo);
						uni.switchTab({
							url: '../home/home'
						});
					},
					// 失败的调用
					fail: (res) => {
						// console.log(res)
						this.loges = true;
					},
				})
			},
			loge() {
				this.loges = false;
				this.Popup = true;
			}

			// 	href: 'https://uniapp.dcloud.io/component/README?id=uniui'
			// }
		}
	}
</script>

<style scoped>
	.container {
		padding: 0px;
		font-size: 15px;
		background-color: #fff;
	}

	.Popup {
		
		line-height: 30px;
		position: absolute;
		margin-top: 20rpx;
		text-align: center;
		width: 90%;
		height: 32vh;
		margin-left: 5%;
		box-shadow: 0px 0px 10px #656;
		border-radius: 10px;
	}

	.text {
		width: 90%;
		margin-left: 5%;
		margin-top: 15px;
	}

	.cancel {
		margin-top: 35px;
		font-size: 13px;
		width: 150px;
		height: 45px;
		border-radius: 20px;
		color: #000000;
		margin-left: 20px;
		line-height: 45px;
		border: solid 1px #666;
	}

	.determine {
		margin-top: 35px;
		font-size: 13px;
		width: 150px;
		height: 45px;
		font-size: 13px;
		line-height: 45px;
		border-radius: 20px;
		background-color: red;
		color: #fff;
		margin-right: 10px;

	}
</style>
